﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>在途</title>
		<link href="Scripts/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
		<link href="Scripts/bootstrap/css/font-awesome.css" rel="stylesheet">
		<link href="Style/skin/css/style.css" rel="stylesheet" type="text/css" />
		<link href="Style/skin/css/animate.css" rel="stylesheet" type="text/css" />
		<link href="Style/skin/font/iconfont.css" rel="stylesheet" type="text/css" />
         <style type="text/css">
        .pagination
        {
            margin: 8px 0;
            display: block;
            font-size: 13px;
        }
        .pagination .controls
        {
            float: left;
            border: 0;
            padding: 7px 0 0 15px;
            color: #777;
        }
        .search-padding {
            padding-bottom: 1px;
        }
        .row {
            margin-right: -15px;
            margin-left: 0px;
        }
        .table {
            width: 100%;
            max-width: 100%;
            margin-bottom: 0px;
            table-layout: fixed;
        }
       
        .tdHidden
        {
            word-break: keep-all; /* 不换行 */
            white-space: nowrap; /* 不换行 */
            overflow: hidden; /* 内容超出宽度时隐藏超出部分的内容 */
            text-overflow: ellipsis; /* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用*/
            -o-text-overflow: ellipsis;
            -icab-text-overflow: ellipsis;
            -khtml-text-overflow: ellipsis;
            -moz-text-overflow: ellipsis;
            -webkit-text-overflow: ellipsis;
        }
    </style>
	</head>
	<body class="gray-bg">
		<div class="wrapper wrapper-content animated fadeInRight">
			<div class="ibox-content">
                <div class="row search-padding">
			        <div class="col-md-4 col-sm-4 pull-left">
				        <div class="form-inline">
					        <div class="form-group">
						        <input type='text' placeholder="请输入关键词..." id='TB_Key' class="form-control" style="width:300px;" />
					        </div>
					        <button class="btn btn-success" type="button" onclick="javascript:SearchKey();"><i class="fa fa-search"></i> 查询</button>
				        </div>
			        </div>
		        </div>	
				<table  class="table  table-striped">
					<thead>
						<tr>
							<th width="40">序</th>
							<th>标题</th>
							<th width="60">发起人</th>
							<th width="120">发起部门</th>
							<th>当前节点</th>
							<th width="120">到达时间</th>
							<th width="150">当前处理人</th>
							<th width="120">操作</th>
						</tr>
					</thead>
					<tbody id="Table1"></tbody>
				</table>
				
                 <!-- 显示分页信息 -->
                <div class="row" style="text-align: left;">
                    <ul class="pagination" id="page_nav">
                    </ul>
                    <ul class="pagination controls" id="page_info">
                    </ul>
                    <div style="clear: both;"></div>
                </div>
			</div>	
		</div>
		<script language="JavaScript" src="./Comm/JScript.js" type="text/javascript"></script>
		<script type="text/javascript" src="./Scripts/bootstrap/js/jquery.min.js"></script>
		<script type="text/javascript" src="./Scripts/bootstrap/js/bootstrap.min.js"></script>
        <script src="Scripts/bootstrap/bootstrap-paginator/js/bootstrap-paginator.js" type="text/javascript"></script>
		<script src="./Scripts/QueryString.js" type="text/javascript"></script>
		<script src="./Scripts/config.js" type="text/javascript"></script>
		<script src="Comm/Gener.js" type="text/javascript"></script>
		<script src="Style/skin/layui/layer.js" type="text/javascript"></script>

		<script language="javascript" type="text/javascript">
		
			function GroupBarClick(groupName) {

				var alt = document.getElementById('Img' + groupName).alert;
				var sta = 'block';
				if(alt == 'Max') {
					sta = 'block';
					alt = 'Min';
					classname='fa fa-minus-square';
				} else {
					sta = 'none';
					alt = 'Max';
					classname='fa  fa-plus-square';
				}

				document.getElementById('Img' + groupName).className =classname;
				document.getElementById('Img' + groupName).alert = alt;

				var i = 0;
				for(i = 0; i <= 600; i++) {

					var row = document.getElementById(groupName + i);

					if(row == null || row == undefined || row.style == null)
						continue;

					if(sta == 'block') {
						row.style.display = '';
					} else {
						row.style.display = sta;
					}
				}
			}

			// 撤销。
			function UnSend(fk_flow, workid, fid) {

				if(window.confirm('您确定要撤销本次发送吗？') == false)
					return;

				//执行撤销.
				$.ajax({
					type: 'post',
					async: true,
					url: Handler + "?DoType=Runing_UnSend&FK_Flow=" + fk_flow + "&WorkID=" + workid + "&FID=" + fid + "&m=" + Math.random(),
					dataType: 'html',
					success: function(data) {
						if(data.indexOf('err@') == 0) {
							alert(data);
							return;
						}

						$("#Msg").html(data + " <br> @点击这里<a href='javascript:window.location.href = window.location.href;' >刷新</a>");
						alert(data);
						var url = 'MyFlow.htm?FK_Flow=' + fk_flow + '&WorkID=' + workid;
						window.open(url);
						window.location.href = window.location.href;
						return;
					}
				});
			}

			//催办.
			function Press(fk_flow, workid, fid) {

				var msg = window.prompt('请输入催办信息', '该工作因为xxx原因，需要您优先处理.');
				if(msg == null)
					return;

				//执行催办.
				$.ajax({
					type: 'post',
					async: true,
					url: Handler + "?DoType=Runing_Press&Msg=" + msg + "&FK_Flow=" + fk_flow + "&WorkID=" + workid + "&FID=" + fid + "&m=" + Math.random(),
					dataType: 'html',
					success: function(data) {
						if(data.indexOf('err@') == 0) {
							alert(data);
							return;
						}

						alert(data);
						return;
					}
				});
			}

			function WinOpenIt(url) {
				
				layer.open({
				  skin: 'layer-class',	
				  type: 2, 
				  title: '在途', 
				  area:['96%','90%'],
				  content: url
				});
			}

			/* ESC Key Down */
			function Esc() {
				if(event.keyCode == 27)
					window.close();
				return true;
			}

			/* 打开表单. */
			function OpenFrm(workid, nodeID, flowNo) {

			    var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_OneWork");
			    handler.AddUrlData();
			    handler.AddPara("FromWorkOpt", "1");
			    handler.AddPara("WorkID", workid);
			    handler.AddPara("FK_Node", nodeID);
			    handler.AddPara("FK_Flow", flowNo);
			    var data = handler.DoMethodReturnString("Runing_OpenFrm");

			    if (data.indexOf('err@') == 0) {
			        alert(data);
			        return;
			    }

			    if (data.indexOf('url@') == 0) {
			        data = data.replace('url@', '');

			        if (data.indexOf('FromWorkOpt') == -1)
			            data = data + "&FromWorkOpt=1";

			        //alert(data);

			        //window.location.href = data;
			        window.open(data);
			        return;
			    }

			    alert(data);

			}

			var pageCount = 1;
			var pageSize = 10;
			var total = 0;
            var pageIdx = 1;
            var pageStartN = 1;
            var realCount = 0;
            var groupNames = [];
			//页面启动函数.
            $(function () {
                //GetRuningData(pageIdx);
                InitPage();
                Paginator(pageCount, pageIdx);

                $(".tdHidden").on("mouseover", function () {
                    if (this.offsetWidth < this.scrollWidth) {
                        var that = this;
                        var text = $(this).text();
                        layer.tips(text, that, {
                            tips: 1,
                            area: [this.offsetWidth+'px', 'auto'],
                            time: 0
                        });
                    }
                });
                $(".tdHidden").on("mouseout", function () {
                    layer.closeAll();
                });
            });

            function GetRuningData(pageIdex) {
                //获取参数，FlowNos，为空时显示所有的待办，否则显示参数中的流程
                var flowNos = GetQueryString("FlowNos");
                if (flowNos == null || flowNos == "" || flowNos == undefined)
                    flowNos = null;
                //查询
                var TB_Key = $("#TB_Key").val();

                var handler = new HttpHandler("BP.WF.HttpHandler.WF");
                var data = handler.DoMethodReturnString("Runing_Init");

                if (data.indexOf('err@') == 0) {
                    alert(data);
                }
                data = JSON.parse(data);

                realCount = data.length;
                if (flowNos != null) {
                    realCount = 0;
                    for (var i = 0; i < data.length; i++) {
                        if (flowNos.indexOf(data[i].FK_Flow) != -1)
                            realCount++;
                    }
                }


                var sourceData;
                //获取在途总的查询信息

                //1.流程编号和查询组件为空时
                if (flowNos == null && TB_Key == "")
                    sourceData = data;
                //2.流程编号不为空和查询组件为空时
                if (flowNos != null && TB_Key == "")
                 sourceData = $.grep(data, function (n, i) {
                        return (flowNos.indexOf(data[i].FK_Flow) != -1);
                    });
                //3.流程编号为空和查询组件不为空时
                    if (flowNos == null && TB_Key != "")
                    sourceData = $.grep(data, function (n, i) {
                        return (data[i].Title.indexOf(TB_Key) != -1);
                    });
                //4.流程编号为不空和查询组件不为空时
                    if (flowNos != null && TB_Key != "")
                    sourceData = $.grep(data, function (n, i) {
                        return (flowNos.indexOf(data[i].FK_Flow) != -1) && (data[i].Title.indexOf(TB_Key) != -1);
                    });

                //生成分组的字符串.
                var str = "";
                for (var i = 0; i < sourceData.length; i++) {
                    if (str.indexOf('@' + sourceData[i].FlowName) == -1) {
                        if (flowNos == null || (flowNos != null && flowNos.indexOf(sourceData[i].FK_Flow) != -1))
                            str += "@" + sourceData[i].FlowName;
                    }

                }
                groupNames = str.split("@"); //生成数组.

                //总数
                total = sourceData.length;
                //获取分页的数据信息
                data = [];
                pageStartN = (pageIdex-1) <0?1:(pageIdx-1)*pageSize;
                pageEndN = pageIdx*pageSize>total?total:pageIdx*pageSize;
                for (var i = pageStartN; i < pageEndN; i++) {
                    data.push(sourceData[i]);
                }

                //总页数
                if (total % pageSize != 0)
                    pageCount = parseInt(total / pageSize) + 1;
                else
                    pageCount = parseInt(total / pageSize);
                if (pageCount == 0) pageCount = 1;

                var div = window.parent.document.getElementById("Todolist_Runing");
                if (div != null) {
                    div.innerHTML = realCount;
                }

                return data;
                
			}
			//初始化数据.
        function InitPage() {
            var data = GetRuningData(pageIdx);
            var is1 = false;
            var num = pageStartN;
            //随机串.
            var timeKey = Math.random();
            $('#Table1').html("");
            for (var idx = 0; idx < groupNames.length; idx++) {
                var showRealCount = 0;
                var listbox = '';
                var groupName = groupNames[idx];
			    if (groupName == "" || groupName == null)
			        continue;

			    listbox += "<tr  onclick=\"GroupBarClick('" + groupName + "')\" > <th colspan=8 class='table-title'> <i class='fa fa-minus-square' alert='Min'  id='Img" + groupName + "'></i><span>" + groupName + "</span></th> </tr>";
			    //增加处理.
			    for (var i = 0; i < data.length; i++) {
			       
			        var work = data[i];
			        if (work.FlowName != groupName)
			            continue;

			        num++;
			        showRealCount++;
			        if (is1 == true) {
			            listbox += "<tr  id='" + groupName + num + "' >";
			            is1 = false;
			        } else {
			            listbox += "<tr  id='" + groupName + num + "' >";
			            is1 = true;
			        }
			        listbox += "<td>" + num + "</td>";
			        listbox += "<td><a href=\"javascript:OpenFrm('" + work.WorkID + "','" + work.FK_Node + "','" + work.FK_Flow + "')\" >" + work.Title + "</a></td>";
			        listbox += "<td>" + work.StarterName + "</td>";
			        listbox += "<td>" + work.DeptName + "</td>";
			        listbox += "<td>" + work.NodeName + "</td>";
			        listbox += "<td>" + work.RDT + "</td>";

			        var todoEmps = work.TodoEmps;

			        if (todoEmps.indexOf(',') != -1)
			            todoEmps = todoEmps.substring(todoEmps.indexOf(',') + 1);

			        listbox += "<td class='tdHidden'>" + todoEmps + "</td>";
			        listbox += "<td>";
			        listbox += "<a href=\"javascript:WinOpenIt('WFRpt.htm?FK_Flow=" + work.FK_Flow + "&FID=0&WorkID=" + work.WorkID + "&FK_Node=" + work.FK_Node + "&IsRead=0&T=" + timeKey + "');\" >轨迹</a>&nbsp &nbsp &nbsp<a href=\"javascript:UnSend('" + work.FK_Flow + "','" + work.WorkID + "','" + work.FID + "')\">撤销</a>";
			        listbox += "</td>";
			        listbox += "</tr>";
			    }
			    if (showRealCount != 0)
			        $('#Table1').append(listbox);
			          
			}
			

        }

        //查询
        function SearchKey() {
            pageIdex = 1;
            InitPage();
            Paginator(pageCount, pageIdx);
        }

		//分页功能
		function Paginator(pageCount, currentPage) {
			var pageCount = pageCount; //取到pageCount的值(把返回数据转成object类型)
			var options = {
			    bootstrapMajorVersion: 3, //版本
			    currentPage: currentPage, //当前页数
			    totalPages: pageCount, //总页数
			    shouldShowPage: true, //是否显示该按钮
			    itemTexts: function (type, page, current) {
			        switch (type) {
			            case "first":
			                return "首页";
			            case "prev":
			                return "上一页";
			            case "next":
			                return "下一页";
			            case "last":
			                return "末页";
			            case "page":
			                return page;
			        }
			    }, //点击事件，用于通过Ajax来刷新整个list列表
			    onPageClicked: function (event, originalEvent, type, page) {
			        pageIdx = page;
			        InitPage(page);
			        $('#page_info').html("").append("<li class='disabled controls'>当前第" + pageIdx + "页，总共" + pageCount +
                            "页,总共" + total + "条记录。</li>");
			    }
			};
			$('#page_nav').bootstrapPaginator(options);
			$('#page_info').html("").append("<li class='disabled controls'>当前第" + pageIdx + "页，总共" + pageCount +
                            "页,总共" + total + "条记录。</li>");

		}
		</script>
	</body>

</html>